import { ref, reactive } from 'vue';

export interface PopupData {
  id: string;
  type: string;
  title?: string;
  position?: { x: number; y: number };
  // 地理坐标信息，用于跟随地图移动
  geoPosition?: {
    longitude: number;
    latitude: number;
    height?: number;
  };
  // 是否跟随地图移动
  followMap?: boolean;
  data?: any;
  visible?: boolean;
  zIndex?: number;
}

interface PopupState {
  activePopups: Map<string, PopupData>;
  zIndex: number;
}

/**
 * 弹窗管理器
 * 用于管理ThingJS触发的各种业务弹窗
 */
export function usePopupManager() {
  const state = reactive<PopupState>({
    activePopups: new Map(),
    zIndex: 1000
  });

  /**
   * 显示弹窗
   * @param popup 弹窗数据
   */
  const showPopup = (popup: PopupData) => {
    const popupWithDefaults = {
      ...popup,
      visible: true,
      zIndex: ++state.zIndex
    };

    state.activePopups.set(popup.id, popupWithDefaults);
    console.log(`显示弹窗: ${popup.type}`, popupWithDefaults);
  };

  /**
   * 隐藏弹窗
   * @param id 弹窗ID
   */
  const hidePopup = (id: string) => {
    const popup = state.activePopups.get(id);
    if (popup) {
      popup.visible = false;
      // 延迟删除，给动画时间
      setTimeout(() => {
        state.activePopups.delete(id);
      }, 300);
    }
  };

  /**
   * 隐藏所有弹窗
   */
  const hideAllPopups = () => {
    state.activePopups.forEach((popup, id) => {
      hidePopup(id);
    });
  };

  /**
   * 获取指定类型的弹窗
   * @param type 弹窗类型
   */
  const getPopupByType = (type: string): PopupData | undefined => {
    for (const popup of state.activePopups.values()) {
      if (popup.type === type && popup.visible) {
        return popup;
      }
    }
    return undefined;
  };

  /**
   * 更新弹窗数据
   * @param id 弹窗ID
   * @param data 新数据
   */
  const updatePopupData = (id: string, data: any) => {
    const popup = state.activePopups.get(id);
    if (popup) {
      popup.data = { ...popup.data, ...data };
    }
  };

  /**
   * 更新弹窗屏幕位置（用于地图拖动时更新位置）
   * @param id 弹窗ID
   * @param position 新的屏幕位置
   */
  const updatePopupPosition = (id: string, position: { x: number; y: number }) => {
    const popup = state.activePopups.get(id);
    if (popup) {
      popup.position = { ...position };
    }
  };

  /**
   * 批量更新所有跟随地图的弹窗位置
   * @param positionUpdates 位置更新数组
   */
  const updateFollowMapPopups = (positionUpdates: Array<{ id: string; position: { x: number; y: number } }>) => {
    positionUpdates.forEach(({ id, position }) => {
      const popup = state.activePopups.get(id);
      if (popup && popup.followMap && popup.visible) {
        popup.position = { ...position };
      }
    });
  };

  /**
   * 获取所有跟随地图的弹窗
   */
  const getFollowMapPopups = () => {
    return Array.from(state.activePopups.values()).filter((popup) => popup.visible && popup.followMap && popup.geoPosition);
  };

  return {
    state,
    showPopup,
    hidePopup,
    hideAllPopups,
    getPopupByType,
    updatePopupData,
    updatePopupPosition,
    updateFollowMapPopups,
    getFollowMapPopups
  };
}

// 创建全局实例
export const globalPopupManager = usePopupManager();
